<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="css/style.css">
    <title>home</title>
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
</head>
<body>
<header>
    <div class="container clearfix">
        <img src="img/brand-white.png" alt="">
        <ul>
            <li><a href="">Home</a></li>
            <li><a href="">Profile</a></li>
            <li><a href="">Messages</a></li>
            <li><a href="">Docs</a></li>
        </ul>
    </div>
</header>
<main>
    <div class="container">
        <div class="item-1">
            <div class="one">
                <img src="img/iceland.jpg" alt="" class="yuanye">
                <img src="img/avatar-dhg.png" alt="" class="nanren">
                <h4>Dave Gamache</h4>
                <p>l wish i was a little bit taller,wish i was a baller.</p>
            </div>
            <div class="two">
                <h4>About</h4>
               <ul>
                   <li>Went to <a href="">Oh,Canada</a></li>
                   <li>Became friends with <a href="">Obama</a></li>
                   <li>Worked at <a href="">Github</a></li>
                   <li>Lives in <a href="">San Francisco,CA</a></li>
                   <li>From <a href="">Seattle, WA</a></li>
               </ul>
            </div>
            <div class="three">
                <h4>Photos</h4>
                <img src="img/instagram_5.jpg" alt="">
                <img src="img/instagram_6.jpg" alt="">
                <img src="img/instagram_7.jpg" alt="">
                <img src="img/instagram_8.jpg" alt="">
                <img src="img/instagram_9.jpg" alt="">
                <img src="img/instagram_10.jpg" alt="">
            </div>
        </div>
        <div class="item-2">
            <div class="a">
                <div class="first">
                    <h4>Dave Gamache</h4>
                    <span>Aenean lacinia bibendum nulla sed consectrtur.Vestbulum id ilgula porta felis
                        euismod semper.Morbi leo risus,porta ac consectetur ac,vesitbulum at eros. Cras
                        justo odio, depibus ac facilisis in,egestas eget quam.Vestibulum id ligula porta felis
                        euismod semper.Cum sociis natoque penatibus et magnis dis partulurient montes,nascetur ridiculus mus.</span>
                </div>
                <div class="second">
                    <img src="img/unsplash_1.jpg" alt="">
                    <img src="img/unsplash_2.jpg" alt="">
                    <img src="img/instagram_13.jpg" alt="">
                    <img src="img/instagram_1.jpg" alt="">
                </div>
                <div class="third">
                    <p>Jacon Thornton: <span>Donec id elit non mi porta gravida at eget metus.Vivamus sagittis
                        lacus vel aygye laoreet rutrum faucibus dolor auctor.Donec ullamcorper nulla non
                        metus auctor fringilla.Praesent commodo cursor magna,vel scelerisque nisl
                        consectetur rt,Sed posuere consectetur est at lobortis.</span></p>
                </div>
                <div class="fourth">
                    <p>Mark Otto: <span>Lorem ipsum dolor sit amet,consectetur adipiscing elit.Fusce depibus,
                       tellus ac cursus commodo,tortor mauris condimentum nibh,ut fermentum massa
                    justo sit amet risus.</span></p>
                </div>
            </div>
            <div class="b">
                <div class="fivth">
                    <h4>Jacob Thornton</h4>
                    <p>Donce id non mi porta gravida at eget metus.Integer posuese erat a ante
                       venenatis depibus posuere velit aliquet.Cum sociis natoque penatibus et magnis
                        dis parturent montes,nasectur ridiculus mus.Morbi leo tisus porta ac consectetur
                        ac,vestibulum at eros.Lorem iprem ipsum dolor sit amet,consectetur adipscing eilt.</p>
                </div>
            </div>
            <div class="c">
                <div class="sixth">
                    <h4>Mark Otto</h4>
                    <p>Donwc ullamcorper nulla non metus auctor fringilla.Vestibulum id ligula porta felis
                       euismod semper.Aenean eu ieo quam.Pellentesque ornare sem lacinia quam
                       venenatis vestibulum.Etiam porta dem malesuada magna mollis euismod.Donec
                       sed odio dui.</p>
                </div>
                <img src="img/instagram_3.jpg" alt="">
                <div class="seventh">
                    <p>Dave Gamache: <span>Donec id elit non mi porta gravida at eget metus.Vivamus sagittis
                        lacus vel aygye laoreet rutrum faucibus dolor auctor.Donec ullamcorper nulla non
                        metus auctor fringilla.Praesent commodo cursor magna,vel scelerisque nisl
                        consectetur rt,Sed posuere consectetur est at lobortis.</span></p>
                </div>
            </div>
        </div>
        <div class="item-3">
            <div class="d">
                <div class="yi">
                    <h4>Sponsored</h4>
                    <img src="img/instagram_2.jpg" alt="" class="ta">
                    <h5>It minght be time to visit lceiand.</h5>
                    <p>Iceland is so dhill,and everything looks cool here.Also,we heaard the people
                        are pretty nice.What are you waiting for?</p>
                    <a href="">Buy a ticket</a>
                </div>
                <div class="er">
                    <h4>Likes</h4>
                    <div class="jacob clearfix">
                        <img src="img/avatar-fat.jpg" alt="" class="touxiang">
                        <div class="you-1">
                            <p>Jacob Thornton <a href="">@fat</a></p>
                            <a href="" class="follow"><img src="img/rentou_03.gif" alt="" class="ren">Follow</a>
                        </div>
                    </div>
                    <div class="mark clearfix">
                        <img src="img/avatar-mdo.png" alt="" class="touxiang">
                        <div class="you-2">
                            <p>Mark Otto <a href="">@mdo</a></p>
                            <a href="" class="follow"><img src="img/rentou_03.gif" alt="" class="ren">Follow</a>
                        </div>
                    </div>
                </div>
                <div class="san">
                    <p>Dave really likes these nerds,no one konws why though.</p>
                </div>
            </div>
        </div>
    </div>
</main>
<footer>
    <div class="container">
        <div class="footer-1 text-center">
            <p>Designed and built with all the love in the world by <a href="">@mdo,@fat,</a>and <a href="">@dhg</a></p>
                <a href="">About</a>
                <a href="">Terms</a>
                <a href="">Privacy</a>
                <a href="">Licenses</a>
                <a href="">FAQ</a>
        </div>
    </div>
</footer>









</body>
</html>